﻿@{
    Layout = "~/Views/Shared/_mobile.cshtml";
    var showAdmin = !string.IsNullOrEmpty(Request["admin"]);
}
@* *@
<form id="postCards" method='post' action='/File/ProcessForm'>
</form>
@{Bundles.Reference("~/Content/css/menu.css");}
<div class="panel" id="menuPanel" style="display: block;">
    <div class="header ">
        <h3>
            Slovíčka</h3>
    </div>
    <div class="content">
        <ul id="menu">
            <li><a href="#listPanel"><i class="icon icon-align-justify"></i>Slovíčka - přidej a uprav</a></li>
            <li><a href="javascript:submitCards('/File/ProcessForm');"><i class="icon icon-print"></i>Kartičky
                pro tisk</a></li>
            <li><a href="javascript:submitCards('/File/GetCsvFile');"><i class="icon icon-download-alt"></i>Ulož
                jako soubor (CSV formát)</a></li>
                @if (showAdmin)
                { 
             <li><a href="javascript:submitCards('/File/GetJsonFile');"><i class="icon icon-download-alt"></i>Ulož
                jako soubor (Json formát)</a></li>
                }
            <li><a href="#uploadFilePanel"><i class="icon icon-upload-alt"></i>Nahrej ze souboru</a></li>
            @if (showAdmin)
            { 
            <li><a href="javascript:uploadJsonP('http://dl.dropbox.com/u/56216820/word.js')"><i class="icon icon-upload-alt"></i>Nahrej z Dropboxu</a></li>
            }
            <li><a href="#deleteAllPanel"><i class="icon icon-remove-sign"></i>Smazat vše</a></li>
            <li><a href="#learnPanel"><i class="icon icon-user"></i>Opakuj si</a></li>
            <li><a href="mailto:strimpfl@hotmail.com&subject=aplikace Slovíčka"><i class="icon icon-comment"></i>Náměty a připomínky</a></li>
        </ul>
    </div>
</div>
<div class="panel" id="uploadFilePanel">
    <div class="header ">
    <a class="icon icon-backward" onclick="parent.history.back(); return false;" title="jdi zpet"></a>
        <h3>Nahrej ze souboru</h3>
    </div>
    <div class="content">
        <form id="postCards" method='post' action='/File/UploadCSVFile' enctype="multipart/form-data">
        <input type="file" name="file"/><br/>
        <span>oddělovač:</span>
         @Html.DropDownList("separator", FlashcardWeb.Models.Static.FileStaticModel.Instance.GetDelimiters())<br />
        <input type="submit" value="Send"/>
        </form>
    </div>
    
</div>
<div class="panel" id="deleteAllPanel">
    <div class="header ">
    <a class="icon icon-backward" onclick="parent.history.back(); return false;" title="jdi zpet"></a>
        <h3>Smazat vše</h3>
    </div>
    <div class="content">
        <p>Jste si jisti?<br/>
        <a onclick="deleteAll();" class="icon button icon-remove-sign" title="smazat vše"></a>
        </p>
    </div>
    
</div>
@* *@
<div class="panel" id="listPanel">
    <div class="header">
        <a class="icon icon-home" href="#menuPanel" title="hlavní nabídka"></a>
        <h3><a onclick="listCards();" title="klikni pro uspořádání dle abecedy">Slovíčka</a></h3>
        <a class="icon icon-plus-sign" href="#searchPanel" title="vyhledej slovíčko"></a>
    </div>
    <div class="content">
        <ul id="flashcardList" class="list">
        </ul>
    </div>
</div>
@* *@

<div class="panel" id="learnPanel">
    <div class="header">
        <a class="icon icon-home" href="#menuPanel" title="hlavní nabídka"></a>
        <h3><a onclick="listCards();" title="klikni pro uspořádání dle abecedy">Opakuj</a></h3>
         <a class="icon icon-star" onClick="switchOrder()" id="learnOrder" title="změnit"></a>
    </div>
    <div class="content">
        <a onMouseDown="findRandomCard();">
        <div class="learnCard">
            <div class="word"></div>
            <div class="meaning"></div>
        </div>
        </a>
    </div>
</div>
@* *@
<div class="panel" id="deleteListPanel">
    <div class="header">
        Vyberte kartičky
    </div>
    <div class="content">
    </div>
    <div class="footer">
        <a class="icon icon-backward" href="#listPanel" title="jdi zpet"></a> <a class="icon" href="#searchPanel"
            title="odstraň vybrané">T</a>
    </div>
</div>
@* *@
<div class="panel" id="searchPanel">
    <div class="header">
        <a class="icon icon-backward" href="#listPanel" title="jdi zpet"></a>
        <h3>Vyhledej slovíčko</h3>
    </div>
    <div class="content">
        <div class="inputItem">
            <div>
                <input type="text" name="wordToSearch" id="wordToSearch" lang="cs" />
            </div>
            <a class="moreOptions icon icon-ok-sign active" id="searchButton"></a>
        </div>
    </div>
</div>
@* *@
<div class="panel" id="editPanel">
    <div class="header">
        <a class="icon icon-backward" href="#listPanel" title="jdi zpet"></a>
        <h3>
            Uprav slovíčko</h3>
        <a class="icon icon-ok-sign" onclick="saveCard();"></a>
    </div>
    <div class="content">
        <div id="card"></div>
        <div class="inputItem">
            <label for="word">
                Slovo</label>
            <div>
                <input type="text" name="word" id="word" />
            </div>
            <a onclick="moreOptions(this)" id="wordMoreOptions" class="moreOptions icon icon-th" data-panel="wordPanel" title="klikni pro další možnosti"></a>
        </div>
        <div class="inputItem">
            <label for="pronunciation">
                Výslovnost</label>
            <div>
                <input type="text" name="pronunciation" id="pronunciation" />
            </div>
            <a onclick="moreOptions(this)" id="pronunciationMoreOptions" class="moreOptions icon icon-th" data-panel="pronunciationPanel" title = "klikni pro další možnosti"></a>
        </div>
        <div class="inputItem">
            <label for="meaning">
                Význam</label>
            <div>
                <input type="text" name="meaning" id="meaning" />
            </div>
            <a onclick="moreOptions(this);" id="meaningMoreOptions" class="moreOptions icon icon-th"
                data-panel="meaningPanel" title="klikni pro více možností"></a>
        </div>
        <div class="inputItem">
            <label for="example">
                Příklad</label>
            <div>
                <input type="text" name="example" id="example" />
            </div>
            <a onclick="moreOptions(this)" id="exampleMoreOptions" class="moreOptions icon icon-th" data-panel="examplePanel" title="klikni pro více možností"></a>
        </div>
        <div class="inputItem">
            <label for="translation">
                Překlad</label>
            <div>
                <input type="text" name="translation" id="translation" />
            </div>
            <a onclick="moreOptions(this)" id="translationMoreOptions" class="moreOptions icon icon-th" data-panel="examplePanel" title="klikni pro více možností" >
                </a>
        </div>
        <div class="cardAction">
            <a class="icon icon-remove-sign" href="#deleteFlashcard" title="odstranit slovíčko"></a>
        </div>
    </div>
</div>
@* *@
<div class="panel" id="deleteFlashcard">
    <div class="header ">
    <a class="icon icon-backward" onclick="parent.history.back(); return false;" title="jdi zpet"></a>
        <h3>Smazat slovíčko</h3>
    </div>
    <div class="content">
        <p>Jste si jisti?<br/>
        <a onclick="deleteCard();" class="icon button icon-remove-sign" title="smazat slovíčko"></a>
        </p>
    </div>
    
</div>

@* *@
<div class="panel" id="wordPanel">
    <div class="header">
        <a class="icon icon-backward" onclick="parent.history.back(); return false;" title="jdi zpet"></a>
        <h3>
            vyber jiné slovo</h3>
        <a class="icon icon-ok-sign saveOption"></a>
    </div>
    <div class="content">
        <div class="selection">
        </div>
        <p class="options" id="words">
        </p>
    </div>
</div>
@**@
<div class="panel" id="pronunciationPanel">
    <div class="header">
        <a class="icon icon-backward" onclick="parent.history.back(); return false;" title="jdi zpet"></a>
        <h3>
            Změna výslovnosti</h3>
        <a class="icon saveOption">✔</a>
    </div>
    <div class="content">
        <div class="selection">
        </div>
        <p class="options" id="pronunciations">
        </p>
    </div>
</div>
@**@
<div class="panel" id="meaningPanel">
    <div class="header">
        <a class="icon icon-backward" onclick="parent.history.back(); return false;" onmouseup="jQuery(this).blur();" title="jdi zpet"></a>
        <h3>
            Změna významu</h3>
        <a class="icon icon-ok-sign saveOption"></a>
    </div>
    <div class="content">
        <p>Nastaveno:</p>
        <div class="selection">
        </div>
        <p>Možnosti:</p>
        <p class="options" id="meanings">
        </p>
    </div>
</div>
@**@
<div class="panel" id="examplePanel">
    <div class="header">
        <a class="icon icon-backward" onclick="parent.history.back(); return false;" title="jdi zpet"></a>
        <h3>Změna příkladu</h3>
    </div>
    <div class="content">
        <p class="options" id="examples">
        </p>
    </div>
</div>
